<template>
  <v-layout class="release-container" justify-start align-start wrap>
    <v-flex md12 text-xs-left>
      <v-btn flat round @click="$router.go(-1)">
        <ui-icon icon="angle-left fa-lg"></ui-icon>
        <div class="ml-2">返回</div>
      </v-btn>
    </v-flex>
    <v-flex md6 pt-4>
      <v-layout justify-start align-center wrap px-5>
        <v-flex md12 d-flex align-center justify-start>
          <!-- 充值金额 -->
          <v-flex md4>
            <span class="subTitle title-color">用户名称</span>
          </v-flex>

          <v-flex md2 text-xs-left>
            <span class="title title-color">{{ topup.nickName }}</span>
          </v-flex>
        </v-flex>
        <v-flex md12 d-flex align-center justify-start mt-3>
          <!-- 充值金额 -->
          <v-flex md4>
            <span class="subTitle title-color">付款账号</span>
          </v-flex>

          <v-flex md2 text-xs-left>
            <span class="title title-color">{{ topup.paymentNo }}</span>
          </v-flex>
        </v-flex>
        <v-flex md12 d-flex align-center justify-start mt-3>
          <!-- 充值金额 -->
          <v-flex md4>
            <span class="subTitle title-color">交易流水号</span>
          </v-flex>

          <v-flex md2 text-xs-left>
            <span class="title title-color">{{ topup.billNo }}</span>
          </v-flex>
        </v-flex>
        <v-flex md12 d-flex align-center justify-start mt-3>
          <!-- 充值金额 -->
          <v-flex md4>
            <span class="subTitle title-color">时间</span>
          </v-flex>

          <v-flex md6 text-xs-left>
            <span class="title title-color">{{ getTime(topup.createTime) }}</span>
          </v-flex>
        </v-flex>
        <v-flex md12 d-flex align-center justify-start mt-3>
          <v-flex md4>
            <span class="subTitle title-color">充值金额</span>
          </v-flex>

        <v-flex md2 text-xs-left>
            <span class="title title-color">{{ topup.amount }}</span>
          </v-flex>
          <v-flex md1>RMB</v-flex>
        </v-flex>

        <v-flex md12 d-flex align-center ustify-start>
          <!-- 充值方式 -->
          <v-flex md4>
            <span class="subTitle title-color">状态</span>
          </v-flex>

          <v-flex md8>
            <v-radio-group v-model="topup.status">
              <v-radio
                v-for="(item, i) in topupTypes"
                :key="i"
                :label="item.text"
                :value="item.value"
                color="primary"
              ></v-radio>
            </v-radio-group>
          </v-flex>
        </v-flex>

        <v-flex md12 mt-2 d-flex align-center justify-space-between>
          <!-- 交易流水号 -->
          <v-flex md4>
            <span class="subTitle title-color">买家状态说明</span>
          </v-flex>

          <v-flex md8>
            <v-textarea hide-details placeholder="如果拒绝，请填写原因" solo v-model="topup.checkExplains"></v-textarea>
          </v-flex>
        </v-flex>
        <!-- <v-flex md12 mt-2 d-flex align-center justify-space-between>
          <v-flex md4>
            <span class="subTitle title-color">操作备注</span>
          </v-flex>

          <v-flex md8>
            <v-textarea hide-details solo v-model="topup.remark"></v-textarea>
          </v-flex>
        </v-flex>-->

        <v-flex md12 mt-4 d-flex align-center justify-center>
          <v-flex md4>
            <v-btn large round color="primary" @click="onSubmit">
              <span class="title">保存</span>
            </v-btn>
          </v-flex>
        </v-flex>
      </v-layout>
    </v-flex>
  </v-layout>
</template>


<script lang="ts">
// 使用类装饰器
import { Component, Vue } from "vue-property-decorator";
import { KV } from "@/utils/type";
import { Todo } from "@/api";
import { CheckCommon } from "@/api/bean";
import Cookie from "js-cookie";
import { TopupStatusKV } from '@/utils/constants';
import { getTime } from "@/utils/commonUtils";
declare const $Vue: Vue;

@Component({})
export default class TopupAudit extends Vue {
  private topupTypes: Array<KV> = TopupStatusKV;

  private topup: any = {};

  protected mounted() {
    // this.topup = Object.assign({}, this.defaultTopup);
    this.topup = this.$route.params;
    this.getProfitIncomeDetail();
  }

  private onSubmit() {
    this.saveTopupAudit();
  }
  private getTime(date: string) {
    return getTime(date);
  }
  private async getProfitIncomeDetail() {
    const params: any = {
      incomeId: this.topup.incomeId
    };

    const { data } = await Todo.getProfitIncomeDetail.r(params);
    console.log("getProfitIncom eDetail", data);
    if (data.result === 0) {
      this.topup.checkType = data.data.checkType;
    } else {
      $Vue.$emit("snackbar", {
        message: data.message
      });
    }
  }

  private async saveTopupAudit() {
    const params: CheckCommon = {
      foreignType: this.topup.checkType,
      foreignKeyId: this.topup.incomeId,
      checkStatus: this.topup.status,
      checkExplains: this.topup.checkExplains,
      checkUserId: Number(Cookie.get("userId"))
    };
    const { data } = await Todo.saveAudit.r(params);
    console.log("saveAudit", data);
    $Vue.$emit("snackbar", {
      message: data.message
    });
    if (data.result === 0) {
      this.$router.go(-1);
    } else {
    }
  }
}
</script>

<style lang="less" scoped>
</style>


